/**
 * ESUI (Enterprise Simple UI)
 * Copyright 2013 Baidu Inc. All rights reserved.
 *
 * @file 下拉选择样式
 * @author dbear
 */

@import "Variable.less";


// Select
@esui-select-radius: 0;
@esui-select-line-height: 2.5em;
@esui-select-horizontal-padding: 1em;
@esui-select-text-right-padding: 2em;

// Layer
@esui-select-item-selected-color: #6CCDC0;
@esui-select-item-background-selected: #E1E1E1;
@esui-select-layer-max-height: 13em;

.@{ui-class-prefix}-select {
    cursor: pointer;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    outline: 0;
    .user-select(none);
    .box-sizing(border-box);
    padding: 0 @esui-select-horizontal-padding;
    .esui-border-radius(
        @esui-select-radius,
        @esui-select-radius
    );
    height: @esui-select-line-height;
    line-height: @esui-select-line-height;
    .esui-transition(background-color 0.3s ease);
    .esui-select-theme();
    &.@{ui-state-prefix}-disabled {
        .esui-disabled();
    }
}

.@{ui-class-prefix}-select.@{ui-state-prefix}-active {
    .@{ui-class-prefix}-select-arrow {
        .transform(rotate(180deg));
        // .transition(transform 0.3s ease);
    }
}

.@{ui-class-prefix}-select-text {
    padding-right: @esui-select-text-right-padding;
    display: block;
    .ellipsis();
}

.@{ui-class-prefix}-select-arrow {
    position: absolute;
    right: @esui-select-horizontal-padding;
    top: 0;
    line-height: @esui-select-line-height;
    width: 1em;
    text-align: center;
    .eicons-icon(caret-down);
}

.@{ui-class-prefix}-select-layer {
    max-height: @esui-select-layer-max-height;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
}

.@{ui-class-prefix}-select-item-disabled {
    .esui-disabled();
    &:hover {
        background: none;
    }
}

.@{ui-class-prefix}-select-item-selected > :first-child {
    .esui-select-item-selected-theme();
}

// variants
.@{ui-class-prefix}-select-primary {
    .esui-select-primary-theme();
}

// compact
.@{ui-class-prefix}-select-compact {
    .esui-select-compact-theme();
}

.@{ui-class-prefix}-select-layer-compact {
    .esui-select-layer-compact-theme();
}

// bordered
.@{ui-class-prefix}-select-bordered {
    .esui-select-bordered-theme();
}

.@{ui-class-prefix}-select-layer-bordered {
    .esui-select-layer-bordered-theme();
}

// hooks
.esui-select-theme() {}
.esui-select-primary-theme() {}
.esui-select-compact-theme() {}
.esui-select-layer-compact-theme() {}
.esui-select-item-selected-theme() {}
.esui-select-bordered-theme() {}
.esui-select-layer-bordered-theme() {}
